<template>
  <div class="bigBos">
    <MyHeader title="购物车案例"></MyHeader>
    <MyGoods v-for="item in list" :key="item.id" :arr="item"></MyGoods>
    <MyFooter :list="list"></MyFooter>
  </div>
</template>

<script>
import MyHeader from "@/components/MyHeader.vue";
import MyGoods from "@/components/购物车/MyGoods.vue";
import MyFooter from "@/components/购物车/MyFoter.vue";
export default {
  components: {
    MyHeader,
    MyGoods,
    MyFooter,
  },
  data() {
    return {
      list: [],
    };
  },
  async created() {
    const { data: res } = await this.$http.get("/api/cart");
    if (res.status !== 200) return console.log(res.message);
    this.list = res.list;
    console.log(this.list);
  },
  methods: {},
};
</script>

<style>
.bigBos {
  padding: 40px 0 50px;
}
</style>
